@charset "UTF-8";
@import './scssConfig.scss';

* {
  margin: 0px;
  padding: 0px;
  font-weight: lighter;
  font: initial;
  font-size: 12px;
}

.pull-right {
  float: right;
}

.pull-left {
  float: left;
}
.color-main {
  color: $color-main;
}

.color-second {
  color: $color-second;
}

.text-main {
  color: $text-main;
}
.p-r {
  position: relative;
}
.p-a {
  position: absolute;
}
//主体内容显示区域
.container {
  width: $container-width;
  margin: 0 auto;
}

.text-center {
  text-align: center;
}
.text-left {
  text-align: left;
}
.text-right {
  text-align: right;
}
.background-col {
  background-color: #e7e3e3;
}
@for $i from 1 to 121 {
  .padding-top-#{$i} {
    padding-top: (1px * $i);
  }
  .padding-bottom-#{$i} {
    padding-bottom: (1px * $i);
  }
}
//首页logo
body > header {
  background-color: #fff;
}
.logo {
  float: left;
  margin: 30px 0;

  img {
    display: block;
  }
}

//顶部菜单栏
.menulink {
  line-height: 22px;
  a,
  span,
  ul,
  div {
    float: right;
    font-size: 12px;
  }
  //顶栏链接样式
  a {
    color: $text-gray;
  }

  //分割样式
  span {
    width: 1px;
    height: 12px;
    background-color: $text-gray;
    margin: 5px 11px 0;
  }

  //语言选项样式
  .lang {
    position: relative;
    width: 53px;
    height: 22px;
    background: rgba(160, 160, 160, 0.2);
    color: $text-gray;
    text-align: center;
    //鼠标悬停上方时效果
    &:hover {
      ul {
        display: inline;
      }
    }
    //语言下拉箭头标志
    &::after {
      content: '';
      width: 9px;
      height: 9px;
      display: inline-block;
      margin-bottom: 3px;
      margin-left: 1px;
      border-left: 1px solid $text-gray;
      border-bottom: 1px solid $text-gray;
      @include webkit(box-sizing, border-box);
      //旋转i标签
      @include webkit(transform, rotate(-45deg));
    }
    //语言下拉选项卡
    ul {
      display: none;
      position: absolute;
      top: 100%;
      right: 0;
      z-index: 10;
      li a {
        display: block;
        width: 95px;
        height: 28px;
        text-align: center;
        line-height: 28px;
        background: #eaeaea;
        &:hover {
          color: $color-main;
          background-color: $text-gray;
        }
      }
    }
  }
}

//导航栏
nav {
  margin-top: 25px;
  > ul {
    > li {
      float: left;

      &:hover,
      &.current {
        a {
          background-color: #eaeaea;
          //显示导航栏下三角标签
          &:after {
            display: block;
          }
        }
      }
      //导航栏标签三角图标
      > a {
        &::after {
          content: '';
          display: none;
          position: absolute;
          z-index: 2;
          top: 100%;
          left: 50%;
          margin-left: -5px;
          border-top: 5px solid #eaeaea;
          border-right: 5px solid transparent;
          border-left: 5px solid transparent;
        }
      }
      //导航栏下拉菜单
      > ul {
        padding-top: 19px;

        //导航栏下拉子集菜单
        ul {
          left: 100%;
          top: 0;
        }
      }
    }
  }
  //导航栏下拉
  ul {
    ul {
      position: absolute;
      visibility: hidden;
      z-index: 2;
      opacity: 0;
      filter: alpha(opacity = 0);
      @include webkit(transition, all 0.4s ease 0s);
      a {
        height: 41px;
        line-height: 41px;
        background-color: #eaeaea;
        &:hover {
          background-color: $text-gray;
        }
      }
    }
  }

  li {
    position: relative;
    //显示导航栏下拉菜单
    &:hover {
      > ul {
        visibility: visible;
        opacity: 100;
        filter: alpha(opacity = 100);
      }
    }

    //导航栏a标签属性
    a {
      display: block;
      width: 114px;
      height: 53px;
      font-size: 12px;
      color: $text-main;
      font-weight: bold;
      text-align: center;
      line-height: 53px;
    }
  }
}

//底部
body > footer {
  background-color: #eaeaea;
  padding-top: 74px;
}
//版权信息
#Copyright {
  color: $text-gray;
  line-height: 45px;
  border-top: 1px solid $text-gray;
  font-size: 12px;
}
//公司相关信息
.footer-contact-info {
  margin-bottom: 50px;
  h5 {
    font-size: 24px;
    color: $text-gray;
    margin-bottom: 24px;
  }
  p {
    font-size: 13px;
    color: $text-gray;
    line-height: 23px;
    a {
      color: $text-gray;
      font-size: 13px;
    }
  }
  //分享图标样式
  > ul a {
    position: relative;
    width: 30px;
    height: 30px;
    float: left;
    margin-right: 24px;
    border-radius: 50px;
    margin-top: 37px;

    // 微信图标样式
    //微博图标样式
    text-align: center;
    line-height: 30px;
    color: #fff;
    font-size: 18px;
    background-color: $text-gray;
    // 二维码样式
    p {
      display: block;
      visibility: hidden;
      position: absolute;
      opacity: 0;
      width: 70px;
      height: 70px;
      padding: 5px;
      background-color: #fff;
      border-radius: 5px;
      top: -80px;
      left: 50%;
      margin-left: -40px;
      filter: alpha(opacity=0);
      filter: drop-shadow(0 0 10px rgba(0, 0, 0, 0.25));
      @include webkit(transition, all 0.3s ease 0s);
      // 二维码箭头下标
      &::after {
        position: absolute;
        top: 100%;
        right: 50%;
        margin-right: -4px;
        content: '';
        border-top: 4px solid #fff;
        border-right: 4px solid transparent;
        border-left: 4px solid transparent;
      }
      img {
        width: 100%;
      }
    }
  }
  // 微博二维码图标动画
  .share-weibo {
    &:hover {
      background-color: red;
      p {
        visibility: visible;
        filter: alpha(opacity=100);
        top: -90px;
        opacity: 100;
      }
    }
  }
  // 微信二维码图标动画
  .share-weixin {
    &:hover {
      background-color: rgb(7, 167, 7);
      p {
        visibility: visible;
        filter: alpha(opacity=100);
        top: -90px;
        opacity: 100;
      }
    }
  }
}
//底部菜单
.footer-menu {
  dl {
    width: 75px;
    float: left;
    margin-left: 35px;
    font-size: 12px;
    color: $text-gray;
    //二维码
    img {
      width: 65px;
      border: 5px solid #fff;
      margin-bottom: 8px;
    }
    a {
      font-size: 12px;
      color: $text-gray;
    }
    dt {
      border-bottom: 1px solid $text-gray;
      margin-top: 7px;
      padding-bottom: 18px;
      margin-bottom: 14px;
    }
    dd {
      line-height: 20px;
    }
  }
}

//公共标题样式
.main-title {
  text-align: center;
  h4 {
    font-size: 26px;
    padding-bottom: 4px;
  }
  p {
    font-size: 12px;
    color: $text-gray;
    text-transform: uppercase; //文字大写
  }
  span {
    display: inline-block;
    height: 10px;
    border-left: 1px solid $text-gray;
    margin: 0 10px;
  }
}
//加载提示
@keyframes loading {
  from {
    transform: rotate(0deg);
  }
  to {
    transform: rotate(360deg);
  }
}
.loading-wait {
  text-align: center;
  padding: 20px 0px;
  .loading-icon {
    margin-bottom: 10px;
    @include webkit(transform, rotate(0deg));
    animation: loading 1s linear infinite;
  }
  .iconfont {
    font-size: 40px;
  }
}
// 查看更多
.line-more {
  display: block;
  width: 94px;
  height: 31px;
  border: 1px solid $text-main;
  text-align: center;
  line-height: 31px;
  color: $text-main;
  margin-top: 22px;
  .iconfont {
    margin-left: 4px;
    font-size: 15px;
  }
}
//标线样式
.line {
  display: block;
  opacity: 0.2;
  width: 38px;
  border-bottom: 1px solid $text-main;
}
.tag-menu {
  display: flex;
  justify-content: center;
  a {
    display: inline-block;
    line-height: 34px;
    padding: 0 25px;
    border: 1px solid $text-gray;
    margin: 0 4px;
    color: $text-main;
    &.current {
      background-color: $text-gray;
      color: #fff;
    }
  }
}
//图片显示模式
.img-cover {
  background-size: cover;
}
//面包屑
.crumbs {
  background: url(../image/background.png) no-repeat center;
  padding: 85px 0;
  h3 {
    color: #fff;
    font-size: 30px;
    padding-bottom: 15px;
  }
  span {
    padding: 0 5px;
    color: #fff;
  }
  a {
    color: #fff;
  }
}
//公共菜单
.category-menu {
  border: 1px solid #ececec;
  background-color: #fff;
  ul {
    overflow: hidden;
  }
  .box {
    margin: 0 -17px;
    @extend %clearfix;
  }
  li {
    float: left;
    padding: 0 17px;
  }
  a {
    display: block;
    line-height: 49px;
    color: #000;
    margin-bottom: 1px;
    padding: 0 15px;
    &.current {
      color: #21b8c6;
      border-bottom: 1px solid #21b8c6;
    }
  }
}
// 自动分列
.row-content {
  overflow: hidden;
}
.row-wrap {
  @extend %clearfix;
  div[class^='col-item'] {
    float: left;
  }
  .col-item-3 {
    width: 25%;
  }
  .col-item-4 {
    width: 33.3333%;
  }
  .col-item-6 {
    width: 50%;
  }
  .col-item-12 {
    width: 100%;
  }
}
// 内边距
.gutter-15 {
  div[class^='col-item'] {
    padding: 0 15px;
    @include webkit(box-sizing, border-box);
  }
}
.gutter-25 {
  div[class^='col-item'] {
    padding: 0 25px;
    @include webkit(box-sizing, border-box);
  }
}
.gutter-20 {
  div[class^='col-item'] {
    padding: 0 20px;
    @include webkit(box-sizing, border-box);
  }
}
.gutter-30 {
  div[class^='col-item'] {
    padding: 0 30px;
    @include webkit(box-sizing, border-box);
  }
}
//文字区样式
.figure-wrap {
  .title {
    font-size: 18px;
    @include ell(1);
  }
  time {
    display: block;
    opacity: 0.5;
    padding-top: 15px;
    padding-bottom: 21px;
  }
  .doc {
    color: $text-gray;
    line-height: 22px;
    padding-top: 19px;
    @include ell(3);
  }
  .line-more {
    opacity: 0.5;
  }
}
.page {
  text-align: center;
  padding-bottom: 120px;
  a,
  span {
    display: inline-block;
    width: 35px;
    line-height: 35px;
    text-align: center;
    margin: 7px;
    font-size: 14px;
    color: $text-gray;
    background-color: #d8d3d3;
  }
  span {
    background-color: $color-main;
    color: #fff;
  }
}
//去除浮动
.clearfix:after {
  content: '.';
  display: block;
  height: 0;
  clear: both;
  visibility: hidden;
}

.clearfix {
  display: inline-block;
}

* html .clearfix {
  height: 1%;
}

.clearfix {
  display: block;
}
